<template>
<div class="index">
    <!-- <Row :gutter="8">
      <Col :md='{span:8}'>
      <Row>
        <Col span="12" v-for="(item,index) in cardMessage" :key="index" class="cardMessage"  style="padding: 0">
        <Card>
          <Row>
            <Col span="8">
            <Icon :type="item.icon"></Icon>
            </Col>
            <Col span="16">
            <p class="subText">{{item.name}}</p>
            <h3>{{item.count}}</h3>
            </Col>
          </Row>
        </Card>
        </Col>
      </Row>
      </Col>
      <Col :md='{span:16}'>
      <Card>
        <p slot="title">
          本周排行
        </p>
        <a href="#" slot="extra" @click.prevent="refresh">
          <Icon type="ios-loop-strong"></Icon>
        </a>
        <Rate show-text v-model="valueText" :disabled="true">
          <span style="color: #f5a623">{{ valueCustomText }}</span>
        </Rate>
        <Progress :percent="85" status="active"></Progress>
        <Progress :percent="45" status="active"></Progress>
      </Card>
      </Col>
    </Row> -->

    <Row :gutter="8">

        <Col :md='{span:8}'>

        <Card style="height: 320px">
            <p slot="title"><Icon type="speakerphone" ></Icon>&nbsp;公告</p>
            <Table :show-header="false" :columns="bulletinColumn" :data="bulletibnlist" @on-row-click="bClick"></Table>
        </Card>
        </Col>
        <Col :md='{span:8}'>
        <Card style="height: 320px">
            <p slot="title">刑事技术工作介绍</p>
            <Table :show-header="false" :columns="xzColumn" :data="finishlist" height="240" @on-row-click="xzClick"></Table>
        </Card>
        </Col>
        <Col :md='{span:8}'>
        <Card style="height: 320px">
            <p slot="title">待评价</p>
            <Table :columns="columns" :data="todolist" :show-header="true" @on-row-click="rateClick"></Table>
        </Card>
        </Col>
    </Row>
    <Modal
        v-model="descFlag"
        :title="descTmp.title" :width="700" >
        <div v-html="descTmp.content" style="max-height:500px;overflow-y:scroll"></div>
    </Modal>
    <Modal
        v-model="bFlag"
        :title="bTmp.title" :width="700" >
        <div v-html="bTmp.content" style="max-height:500px;overflow-y:scroll"></div>
    </Modal>
    <Modal v-model="rateFlag" @on-ok="rateOk" title="服务评价">
        <Form>
          <FormItem>
            <Row>
              <Col span="12"> <Rate v-model.number="rateForm.Rate" :count="5"></Rate></Col>
              <Col span="12"><span>{{rateStr}}</span></Col>
            </Row>
           
          </FormItem>
          <FormItem label="评价">
            <Input v-model.trim="rateForm.Content" type="text"/> 
          </FormItem>
        </Form>
    </Modal>
</div>
</template>

<script>
import { timeFormat, currency } from "@/common/filter";
import momnet from 'moment';
export default {
  name: "index",
  data() {
    return {
      descFlag: false,
      descTmp: {
        title: "",
        content: ""
      },
      descContent: {},
      bFlag: false,
      bTmp: {
        title: "",
        content: ""
      },
      params: {
        page: 1,
        limit: 10
      },
      valueText: 5,
      valueCustomText: "王警官",
      bulletinColumn: [
        {
          type: "index",
          width: 50
        },
        {
          title: " ",
          key: "Title"
        }
      ],
      xzColumn: [
        {
          type: "index",
          width: 50
        },
        {
          key: "Name"
        }
      ],
      cardMessage: [
        {
          icon: "ios-heart",
          name: "收藏",
          count: "344"
        },
        {
          icon: "ios-cart",
          name: "订单量",
          count: "2111"
        },
        {
          icon: "ios-email",
          name: "未读邮件",
          count: "23"
        },
        {
          icon: "filing",
          name: "归档",
          count: "12"
        }
      ],
      jyType: [
        {
          name: "痕迹",
          value: 0,
          children: [
            {
              name: "手印",
              value: 0
            },
            {
              name: "足迹",
              value: 1
            },
            {
              name: "工具",
              value: 2
            },
            {
              name: "枪弹",
              value: 3
            },
            {
              name: "特殊",
              value: 4
            },
            {
              name: "爆炸",
              value: 5
            },
            {
              name: "其它",
              value: 6
            }
          ]
        },
        {
          name: "法医",
          value: 1,
          children: [
            {
              name: "尸体",
              value: 0
            },
            {
              name: "活体",
              value: 1
            },
            {
              name: "其它",
              value: 2
            }
          ]
        },
        {
          name: "DNA",
          value: 2,
          children: [
            {
              name: "默认",
              value: 0
            }
          ]
        },
        {
          name: "理化",
          value: 3,
          children: [
            {
              name: "毒品",
              value: 0
            },
            {
              name: "毒物",
              value: 1
            },
            {
              name: "微量物证",
              value: 2
            },
            {
              name: "酒精含量",
              value: 3
            },
            {
              name: "其它",
              value: 4
            }
          ]
        },
        {
          name: "文检",
          value: 4,
          children: [
            {
              name: "文字",
              value: 0
            },
            {
              name: "印章",
              value: 1
            },
            {
              name: "其他",
              value: 2
            }
          ]
        },
        {
          name: "电子物证",
          value: 5,
          children: [
            {
              name: "手机",
              value: 0
            },
            {
              name: "电脑",
              value: 1
            },
            {
              name: "其它",
              value: 2
            }
          ]
        }
      ],
      columns: [
        {
          title: "案件",
          key: "Name"
        },
        {
          title: "完成时间",
          key: "Ctime",
          render: (h, {row}) => {
            return h("span",{}, momnet(row["Ctime"]).format("YYYY-MM-DD HH:mm"))
          }
        },
        {
          title: "评分",
          key: "Rate",
          render: (h, { row }) => {
            return h("span", {}, row["Rate"] == 0 ? "暂未评分":  row["Rate"]);
          }
        }
      ],
      data1: [
        {
          name: "王小明",
          age: 18,
          address: "北京市朝阳区芍药居"
        },
        {
          name: "张小刚",
          age: 25,
          address: "北京市海淀区西二旗"
        },
        {
          name: "李小红",
          age: 30,
          address: "上海市浦东新区世纪大道"
        },
        {
          name: "周小伟",
          age: 26,
          address: "深圳市南山区深南大道"
        },
        {
          name: "赵小钱",
          age: 27,
          address: "武汉市武昌区区关山大道"
        }
      ],
      todolist: [],
      doinglist: [],
      finishlist: [],
      bulletibnlist: [],
      rateForm: {
        Rate: 0,
        Content: ""
      },
      rateFlag: false
    };
  },
  computed: {
    rateStr() {
      switch(this.rateForm.Rate) {
        case 5: return "非常满意"
        case 4: return "满意"
        case 3: return "一般"
        case 2: return "不满意"
        case 1: return "非常不满意"
        default: return "非常满意"
      }
    }
  },
  methods: {
    rateClick(row, index) {
      this.rateForm = row
      this.rateForm.Rate = 5
      this.rateFlag = true
    },
    rateOk() {
      if (this.rateForm.Rate < 5 && this.rateForm.Content == "" ) {
        this.$Message.warning("请填写评价！")
      } else {
        this.$api.UpdateRate(this.rateForm).then(res=> {
          if (res.code == 0) {
            this.$Message.success("评价已提交！")
            this.gettodo()
          }
        })
      }
    },
    xzClick(row, index) {
      // this.descTmp.title = row.T
      this.getSfDescByDept(row);
    },
    bClick(row, index) {
      console.log(row);
      this.bTmp.title = row["Title"];
      this.bTmp.content = row["Content"];
      this.bFlag = true;
    },
    getdoing() {
      this.loading = true;
      let data = {
        busyName: "sf_case"
      };
      this.$api.GetBusyDoing(data).then(res => {
        console.debug(res.Data);
        if (!res.error) {
          if (res.Data) {
            this.doinglist = res.Data;
          }
          // if (this.dataAll) {
          //   this.total = this.dataAll.length;
          // }
        } else {
          this.$Message.error(res.message);
        }
      });
    },
    gettodo() {
      this.$api.GetMyRate().then(res => {
        if (!res.error) {
          console.log(res.Data);
          if (res.Data) {
            this.todolist = res.Data;
          }
          // this.todolist = res.Data;
          // if(this.total){
          //   this.total = (res.Data).length
          // }
        } else {
          this.$Message.error(res.message);
        }
      });
    },
    getfinish() {
      let data = {
        busyName: "sf_case"
      };
      this.$api.getAssetsbuyFinish(data).then(res => {
        if (!res.error) {
          console.log(res.Data);
          if (res.Data) {
            this.finishlist = res.Data;
          }
          // this.finishlist = res.Data;
          // if(this.total){
          //   this.total = (res.Data).length
          // }
        } else {
          this.$Message.error(res.message);
        }
      });
    },
    getMyBulletin() {
      let pageData = {
        pagesize: 5,
        page: 1,
        searchKey: "",
        sortby: ["Ctime"],
        order: ["desc"]
      };
      this.$api.getBulletin(pageData).then(res => {
        if (res.code == 0) {
          if (res.Data) {
            this.bulletibnlist = res.Data.tabledata;
          }
        }
      });
    },
    getSfDescByDept(dept) {
      this.$api.GetSfDescByDept(dept).then(res => {
        if (res.code == 0) {
          this.descFlag = true;
          this.descContent = res.Data;
          this.descTmp.title = dept["Name"];
          this.descTmp.content = this.descContent["Desc"];
        }
      });
    },
    getFenju() {
      this.$api.GetFenju().then(res => {
        if (res.code == 0) {
          this.finishlist = res.Data;
        }
      });
    },

    /**
     * 刷新页面请求
     * */
    refresh() {}
  },
  created() {},
  mounted() {
    // this.getdoing();
    this.gettodo();
    // this.getfinish();
    this.getMyBulletin();
    this.getFenju();
  }
};
</script>

<style lang="less" scoped>
.cardMessage {
  .ivu-icon {
    font-size: 38px;
  }

  .subText {
    color: #9ea7b4;
  }
}
</style>
